import React, { Component } from 'react';
import { StyleSheet, View } from 'react-native';

import { SafeAreaView } from 'react-navigation';

import BaseStyle from '../constants/Style';

import Textarea from '../components/textarea';

export default class TextareaScreen extends Component {
  constructor(props) {
    super(props);
    this.state = {
      text: '',
    };
  }

  render() {
    return (
      <SafeAreaView
        style={[BaseStyle.flex, styles.homebg]}
        forceInset={{ top: 'never' }}>
        <View style={styles.container}>
          <Textarea
            inputLength={this.state.text.length}
            onChangeText={v => {
              this.setState(
                {
                  text: v,
                },
                () => {},
              );
            }}
            maxLength={1000}
          />
        </View>
      </SafeAreaView>
    );
  }
}

const styles = StyleSheet.create({
  homebg: {
    backgroundColor: '#fff',
  },
  container: {
    ...BaseStyle.flex,
    paddingTop: 20,
  },
});
